<template>
  <div class="app">
    <div class="lis_home">
      <el-table :data="tableData" class="home_list">
        <el-table-column align="left">
          <template slot="header">
            <i class="el-icon-notebook-2"></i>项目名称
          </template>
          <template slot-scope="scope">
            {{ scope.row.title }}
          </template>
        </el-table-column>

        <el-table-column width="300" align="left">
          <template slot="header">
            <i class="el-icon-office-building"></i>参加单位
          </template>
          <template slot-scope="scope">
            <p v-for="item in scope.row.hospital_name" :key="item.id">
              {{ item.hospital_name }}
            </p>
          </template>
        </el-table-column>

        <el-table-column align="left">
          <template slot="header">
            <i class="el-icon-date"></i>启动时间
          </template>
          <template slot-scope="scope"
            >{{ scope.row.start_time | time }}
          </template>
        </el-table-column>

        <el-table-column align="left">
          <template slot="header">
            <i class="el-icon-box"></i>入组情况
          </template>
          <template slot-scope="scope">
            <p v-for="item in scope.row.hospital_name" :key="item.id">
              {{ item.datacount2 }} / {{ item.datacount1 }} /
              {{ scope.row.ingroup_num }}
            </p>
          </template>
        </el-table-column>

        <el-table-column align="left">
          <template slot="header">
            <i class="el-icon-set-up"></i>当前状态
          </template>
          <template slot-scope="scope">
            <span v-if="scope.row.status == 1">未开始</span>
            <span v-if="scope.row.status == 2">进行中</span>
            <span v-if="scope.row.status == 3">已结束</span>
          </template>
        </el-table-column>

        <el-table-column align="left">
          <template slot="header"> 查看 </template>
          <template slot-scope="scope">
            <el-button size="mini" @click="handleEdit(scope.$index, scope.row)"
              >项目详情</el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <pagination :count="count" @pageChage="pageChage" />
    </div>
  </div>
</template>

<script>
import { getpagelinchuangList } from '@/api/home.js'
import pagination from '@/components/pagination'
export default {
  components: {
    pagination,
  },
  data() {
    return {
      count: '',
      tableData: [],
      search: '',
      userInfo: this.$store.state.user.info,
    }
  },
  created() {
    this.getData()
  },
  methods: {
    async getData() {
      let a = await getpagelinchuangList({
        hospital_id: this.userInfo.hospital_id,
        power: this.userInfo.power,
      })
      this.tableData = a.info2
      this.count = a.count
    },
    handleEdit(index, row) {
      console.log(index, row)
    },
    handleDelete(index, row) {
      console.log(index, row)
    },
    pageChage(data) {
      console.log(data)
    },
  },
}
</script>

<style lang="less" scoped>
.app {
  width: 100%;
  height: 100vh;
  // background-color: aquamarine;
  padding: 96px 16px;
}
.lis_home {
  width: 100%;
  border-radius: 2px;
  max-width: 1432px;
  margin: auto;
  overflow: hidden;
}
.home_list {
  border: 1px solid #dddddd;
  border-bottom: 0px solid #000;
}
</style>
